import { ListPage } from "custom/index";
import { bindDialog } from './dialog'
import { dialog } from '@/utils/dialog'
import { getEmailList, getEmailStatus } from './api'
import EmailDetail from './components/EmailDetail.vue'
import DebingEmail from './components/DebingEmail.vue'
import { emailTypeOptions } from './constant'

const viewAction = async (ctx) => {
  const row = ctx.props.row || {}
  await dialog(EmailDetail, { title: '邮件详情', modalClass: 'custom-dialog' }, { params: { emailConfigId: row.emailConfigId, readStatus: row.readStatus, messageId: row.messageId } })
}

const onDebing = async () => {
  await dialog(DebingEmail, { title: '邮箱解绑', modalClass: 'custom-dialog' })
}

const page = new ListPage('EmailCollection');

page
  .api(getEmailList)
  .useAsyncTabs()
    .setProp('readStatus')
    .api(async () => {
      const data = await getEmailStatus() || []
      const s1 = data.find(i => i.readStatus === '1') || {}
      const s2 = data.find(i => i.readStatus === '2') || {}
      return [
        { label: `未读(${s2.count || 0})`, value: '2' },
        { label: `已读(${s1.count || 0})`, value: '1' }
      ]
    })
    .setAsyncDefault(tabs => {
      return tabs[0]?.value
    })
    .end()
  .useSearch().end()
  .useTable()
    .useIndexColumn().end()
    // .useColumn('emailUrl').label('来源邮箱').minWidth(160).sortable().end()
    .useEnumColumn('emailType', emailTypeOptions).minWidth(160).label('来源邮箱').end()
    .useColumn('emailUrl').label('邮箱账号').minWidth(160).end()
    .useColumn('subject').label('内容').minWidth(200).end()
    .useColumn('date').label('时间').minWidth(160).end()
    .end()
  .usePagination()
    .end()
  .useAuthButton()
    .useItem('add').primary().content('绑定邮箱').addRow(bindDialog).end()
    .useItem('delete').danger().content('邮箱解绑').action(onDebing).end()
    .end()
  .useAuthColumn({ width: 140 })
    .useItem('').content('查看').action(viewAction).end()
    .end()

export default page
